<template>
  <div>
    <Header :title="'返回'" :hasBackPath="true" @headerBack="headerBack"></Header>
    <a-card :bordered="false">
      <h1></h1>
      <div class="table-page-search-wrapper">
        <a-form layout="inline">
          <a-row :gutter="48" @keyup.enter.native="searchList">
            <a-col :lg="8" :md="12" :sm="24">
              <a-form-item label="明细编号">
                <a-input v-model="queryParam.itemId" placeholder="" allowClear />
              </a-form-item>
            </a-col>
            <a-col :lg="8" :md="12" :sm="24">
              <a-form-item label="用户昵称">
                <a-input v-model="queryParam.nickName" placeholder="" allowClear />
              </a-form-item>
            </a-col>
            <a-col :lg="8" :md="12" :sm="24">
              <a-form-item label="手机号">
                <a-input v-model="queryParam.phone" placeholder="" allowClear />
              </a-form-item>
            </a-col>
            <a-col :lg="8" :md="12" :sm="24">
              <a-form-item label="创建时间" has-feedback>
                <a-range-picker
                  style="width: 100%"
                  showToday
                  :show-time="{
                    hideDisabledOptions: true,
                    defaultValue: [moment('00:00:00', 'HH:mm:ss'), moment('23:59:59', 'HH:mm:ss')]
                  }"
                  valueFormat="YYYY-MM-DD HH:mm:ss"
                  format="YYYY-MM-DD HH:mm:ss"
                  :placeholder="['开始时间', '结束时间']"
                  v-model="queryParam.regTime"
                />
              </a-form-item>
            </a-col>
            <a-col :lg="16" :md="12" :sm="24">
              <span class="table-page-search-submitButtons" :style="{ float: 'right', overflow: 'hidden' }">
                <a-button type="primary" @click="searchList">查询</a-button>
                <a-button style="margin-left: 8px" @click="resetList">重置</a-button>
              </span>
            </a-col>
          </a-row>
        </a-form>
      </div>
      <s-table ref="table" size="default" :rowKey="record => record.id" :columns="columns" :data="loadData" :pagination="paginationProps">
        <span slot="cardLevel" slot-scope="text">
          {{ text | cardLevel }}
        </span>
        <span slot="action" slot-scope="text, record">
          <router-link :to="`/marketingCenter/memberPromotions/memberTask/detail-list/edit/${record.id}`">明细</router-link>
          <a-divider type="vertical" />
          <router-link :to="`/marketingCenter/memberPromotions/memberTask/${record.id}`">编辑</router-link>
          <a-divider type="vertical" />
          <router-link :to="`/marketingCenter/memberPromotions/memberTask/edit/${record.id}/copy`">复制</router-link>
          <a-divider type="vertical" />
          <a @click="handleLog(record.id)">日志</a>
          <a-divider type="vertical" />
          <a-popconfirm title="确定上架吗?" ok-text="Yes" cancel-text="No" @confirm="handleEnable(record, 1)" v-if="record.status == 0">
            <a href="#">上架</a>
          </a-popconfirm>
          <a-popconfirm title="确定下架吗?" ok-text="Yes" cancel-text="No" @confirm="handleEnable(record, 0)" v-if="record.status == 1">
            <a href="#">下架</a>
          </a-popconfirm>
          <template>
            <a-divider type="vertical" />
            <a-popconfirm title="确定删除吗?" ok-text="Yes" cancel-text="No" @confirm="handleDelete(record)">
              <a href="#">删除</a>
            </a-popconfirm>
          </template>
        </span>
      </s-table>
    </a-card>
  </div>
</template>
<script>
import Header from '@/views/box/components/layouts/Header'
import { listMixin } from '@/views/box/util/listMixin'
import { queryTaskDetails } from '@/api/marketingCenter/memberTask'
import { taskMixin } from './mixin'
let columns = [
  { title: '任务明细编号', dataIndex: 'taskItemNo' },
  { title: '用户昵称', dataIndex: 'nickName' },
  { title: '手机号', dataIndex: 'phone' },
  { title: '会员等级', dataIndex: 'cardLevel', scopedSlots: { customRender: 'cardLevel' } },
  { title: '奖励积分', dataIndex: 'gainPoints' },
  { title: '本次任务完成次数', dataIndex: 'requiredTimes' },
  { title: '奖励时间', dataIndex: 'gainTime' }
]
export default {
  mixins: [listMixin, taskMixin],
  components: { Header },
  data() {
    return {
      columns,
      id: '',
      queryParam: {},
      loadData: parameter => this.fetchData(parameter)
    }
  },
  filters: {
    cardLevel(t) {
      switch (t) {
        case 1:
          return '银卡'
        case 2:
          return '金卡'
        case 3:
          return '白金卡/铂金卡'
      }
    }
  },
  methods: {
    fetchData(parameter) {
      this.id = this.$route.params.id
      let formValue = JSON.parse(JSON.stringify(this.queryParam))
      delete formValue.regTime
      if (this.queryParam.regTime && this.queryParam.regTime.length > 0) {
        formValue.startTime = this.queryParam.regTime[0]
        formValue.endTime = this.queryParam.regTime[1]
      }
      let params = {
        page: parameter,
        requestData: { ...formValue, id: this.id }
      }
      try {
        return this.fetchList(params, queryTaskDetails).then(res => {
          if (res.code == 0) {
            return {
              data: res.data,
              page: res.page
            }
          } else {
            return {
              data: [],
              page: {
                pageNo: 1,
                pageSize: 10,
                count: 0
              }
            }
          }
        })
      } catch (err) {
        console.log(err)
      }
    }
  }
}
</script>

